<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/fankeCss/fanke.css"/>
    <script src="js/jquery-3.1.0.min.js"></script>
    <script src="js/fankeJs/slider.js"></script>
</head>
<body>
    <header>
        <!--最上面-->
        <div class="headtop" >
        <div class="wrap">
            <div class="topRight">
                <a href="javascript:void(0)">我的订单</a>
                <a href="javascript:void(0)" style="margin: 0 6px"><img src="img/fankeImg/laba.png" alt="" style="margin: 6px 5px"/><span class="qq">网站公告</span></a>
                <a href="javascript:void(0)" style="margin: 0 5px">
                    <img src="img/fankeImg/wx.jpg" alt=""/>
                    <img src="img/fankeImg/wb.jpg" alt=""/>
                </a>
            </div>
            <div class="topLeft">
                <span id="top">您好，欢迎光临凡客诚品！</span>
                <a href="javascript:void(0)">登录</a>
                <span>|</span>
                <a href="javascript:void(0)">注册</a>
            </div>
        </div>
        </div>
        <!--中间-->
        <div class="headCenter">
            <div class="wrap">
                <div class="bor">
                    <div class="borTop">
                    <div class="gouwuche"><a href="javascript:void(0)">购物车(0)</a></div>
                    <div class="searchBtn"></div>
                    <input type="text" class="input" name="input" id="input"/>
                    </div>
                    <p class="desc">
                        <span>热门搜索</span>
                        <span>免烫衬衫</span>
                        <span>羽绒服</span>
                        <span>羊毛大衣</span>
                        <span>户外鞋</span>
                        <span>休闲裤</span>
                    </p>
                </div>

            </div>
        </div>

        <!--底部导航-->
        <div class="headBottom">
          <div class="wrap">
              <!--logo-->
            <div class="logo">
                <img src="img/fankeImg/fankelogo.png" alt=""/>
            </div>
              <!--nav-->
              <div class="nav">
                  <ul class="navBar">
                      <li class="navBarList"><a href="javascript:void(0)">首页</a><span></span></li>
                      <li class="navBarList cs"><a href="javascript:void(0)">衬衫</a>
                          <span></span>
                            <div class="csList">
                                <i></i>
                                    <ul>
                                        <li><a href="javascript:void(0)">免烫</a></li>
                                        <li><a href="javascript:void(0)">高支</a></li>
                                        <li><a href="javascript:void(0)">休闲</a></li>
                                        <li><a href="javascript:void(0)">法兰绒</a></li>
                                        <li><a href="javascript:void(0)">牛津纺</a></li>
                                        <li><a href="javascript:void(0)">青年布</a></li>
                                        <li><a href="javascript:void(0)">牛仔</a></li>
                                        <li><a href="javascript:void(0)">麻</a></li>
                                        <li><a href="javascript:void(0)">府绸</a></li>
                                        <li><a href="javascript:void(0)">私人定制</a></li>
                                    </ul>
                            </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">羽绒服</a>
                          <span></span>
                          <div class="csList csListT1">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>

                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">外套</a>
                          <span></span>
                          <div class="csList csListT2">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                                  <li><a href="javascript:void(0)">法兰绒</a></li>
                                  <li><a href="javascript:void(0)">牛津纺</a></li>
                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">针织衫</a>
                          <span></span>
                          <div class="csList csListT3">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                                  <li><a href="javascript:void(0)">法兰绒</a></li>
                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">水柔绵</a>
                          <span></span>
                          <div class="csList csListT4">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                                  <li><a href="javascript:void(0)">法兰绒</a></li>
                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">裤装</a>
                          <span></span>
                          <div class="csList csListT5">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                                  <li><a href="javascript:void(0)">法兰绒</a></li>
                                  <li><a href="javascript:void(0)">牛津纺</a></li>
                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">鞋</a>
                          <span></span>
                          <div class="csList csListT6">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                                  <li><a href="javascript:void(0)">法兰绒</a></li>
                                  <li><a href="javascript:void(0)">牛津纺</a></li>
                                  <li><a href="javascript:void(0)">青年布</a></li>
                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">袜品</a>
                          <span></span>
                          <div class="csList csListT7">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                              </ul>
                          </div>
                      </li>
                      <li class="navBarList cs"><a href="javascript:void(0)">家居配饰</a>
                          <div class="csList">
                              <i></i>
                              <ul>
                                  <li><a href="javascript:void(0)">免烫</a></li>
                                  <li><a href="javascript:void(0)">高支</a></li>
                                  <li><a href="javascript:void(0)">休闲</a></li>
                                  <li><a href="javascript:void(0)">法兰绒</a></li>
                                  <li><a href="javascript:void(0)">牛津纺</a></li>
                                  <li><a href="javascript:void(0)">青年布</a></li>
                                  <li><a href="javascript:void(0)">牛仔</a></li>
                                  <li><a href="javascript:void(0)">麻</a></li>
                                  <li><a href="javascript:void(0)">府绸</a></li>
                                  <li><a href="javascript:void(0)">私人定制</a></li>
                              </ul>
                          </div>
                      </li>
                  </ul>
              </div>
          </div>
        </div>
    </header>

        <section class="sec1">
            <div class="wrap">
                <div class="content" id="content">
                    <div class="imgList">
                        <img src="img/fankeImg/s1.jpg" alt="" class="sliderImg" style="opacity: 1"/>
                        <img src="img/fankeImg/s2.jpg" alt="" class="sliderImg"style="opacity: 0"/>
                        <img src="img/fankeImg/s3.jpg" alt="" class="sliderImg"style="opacity: 0"/>
                        <img src="img/fankeImg/s4.jpg" alt="" class="sliderImg"style="opacity: 0"/>
                        <img src="img/fankeImg/s5.jpg" alt="" class="sliderImg"style="opacity: 0"/>
                        <img src="img/fankeImg/s6.jpg" alt="" class="sliderImg"style="opacity: 0"/>
                        <img src="img/fankeImg/s7.jpg" alt="" class="sliderImg"style="opacity: 0"/>
                    </div>
                    <div class="circle">
                        <span class="selected"></span>
                        <span></span>
                        <span></span>
                        <span></span>
                        <span></span>
                        <span></span>
                        <span></span>
                    </div>
                    <div class="narrow">
                        <div class="left"></div>
                        <div class="right"></div>
                    </div>
                </div>
            </div>
        </section>
            <!--双11活动-->
        <section class="sec2">
            <div class="wrap">
            <img src="img/fankeImg/sliderB.jpg" alt=""/>
            <img src="img/fankeImg/sliderb%20(2).jpg" alt=""/>
            </div>
        </section>
        <!--商品列表-->
        <section class="sec3">
            <div class="wrap">
                <img src="img/fankeImg/img1.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i2.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i3.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i4.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i5.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i6.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i7.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i8.jpg" alt="" class="splb"/>
                <img src="img/fankeImg/i9.jpg" alt="" class="splb"/>
            </div>
        </section>
        <section class="sec4">
            <div class="wrap">
                <div class="bor">
                    <div class="top">
                        <div class="left">
                        <img src="img/fankeImg/r28Kq1AIAlNTgAADAMTVRS91lsofAAAAAElFTkSuQmCC.png" alt=""/>
                        <p class="red">7X9小时在线客服</p>

                    </div>
                        <div class="center">
                            <img src="img/fankeImg/qXx7gKvzfcy7LaydnfrFR87PqOPGDBtdxI6M2RzEGTzx0EmMQdY63LLSNz9LsrSLax4i+XDCifRrRvwIMAM1tRbFzUpApAAAAAElFTkSuQmCC.png"
                                 alt=""/>
                            <p>7天内退货</p>
                            <p>购物满199元免运费</p>
                        </div>
                        <div class="right">
                            <img src="img/fankeImg/2Q==.jpg" alt="" width="104px" height="104px"/>
                            <p>扫描下载 <span>凡客</span> 客户端</p>
                        </div>
                    </div>
                    <div class="bottom">
                        <a href="javascript:void(0)">关于凡客</a>
                        <a href="javascript:void(0)">新手指南</a>
                        <a href="javascript:void(0)">配送范围及时间</a>
                        <a href="javascript:void(0)">支付方式</a>
                        <a href="javascript:void(0)">售后服务</a>
                        <a href="javascript:void(0)" style="border: none">帮助中心</a>
                    </div>
                </div>
            </div>
        </section>

        <footer>
          <div class="wrap">
            <p class="fooDesc">Copyright 2007 - 2016 vancl.com All Rights Reserved 京ICP证100557号 京公网安备11011502002400号 出版物经营许可证新出发京批字第直110138号</p>
            <p class="fooDesc">凡客诚品（北京）科技有限公司</p>
            <div class="imgList">
                <a href="javascript:void(0)" class="i1"></a>
                <a href="javascript:void(0)" class="i2"></a>
                <a href="javascript:void(0)" class="i3"></a>
                <a href="javascript:void(0)" class="i4"></a>
                <a href="javascript:void(0)" class="i5"></a>
                <a href="javascript:void(0)" class="">
                    <img src="img/fankeImg/y.png" alt="" class="i6" style="width: 120px;height: 39px"/></a>
            </div>
          </div>
        </footer>

        <div class="fix">
            <a href="javascript:void(0)"><div class="fix1"></div></a>
            <a href="javascript:void(0)"><div class="fix2"></div></a>
            <a href="#top" id="toTop"><div class="fix3"></div></a>
        </div>
    <script>
        var height=document.body.scrollTop;

        console.log(height);
        $("#toTop").click(function () {
            $("body").animate(
                    {
                        scrollTop:height+'px'
                    },
                    200);
        })
    </script>
</body>
</html>